<template>
	<!--地址选择-->
	<div id="addCheck">
		<x-header :left-options="{showBack: false}" title="地址选择" class="header">
			<a slot="left" @click="back()"><i class="tp-icon icon-black-back"></i></a>
			<a slot="right" href="#/AddManage">管理</a>
		</x-header>
		<div class="addList">
			<img class="border_img" src="../assets/images/home/icon_border.png" alt="" />
			<ul>
				<li v-if="count == 0">暂无地址信息</li>
				<li v-else v-for="(item,index) in addressList" @click="addSiteInfo(item.receiver_id)">
					<div class="left_bar">
						<p>{{item.receiver_name}}</p>
						<span v-if="item.receiver_default == 1" @click="defaultAdd(item.receiver_id)">默认</span>
						<span class="default" v-else @click="defaultAdd(item.receiver_id)">默认</span>
					</div>
					<div class="info">
						<span>{{item.receiver_tel}}</span>
						<p>{{item.receiver_province}}{{item.receiver_city}}{{item.receiver_county}}{{item.receiver_address}}</p>
					</div>
				</li>
			</ul>
		</div>

		<div class="addBtn" @click="addSite()">
			<span>添加新地址</span>
		</div>
		<toast v-model="success" type="text" width="3.5rem">{{msg}}</toast>
	</div>
</template>

<script>
	import { XHeader, Toast } from 'vux'
	import Cookies from 'js-cookie'
	export default {
		data() {
			return {
				addressList: [],
				count: '',
				success: false,
				forbid: false,
				msg: '',
				url: '',
				order_from: '',
				order_url: '',
				order_sn: ''
			}
		},
		components: {
			XHeader,
			Toast
		},
		activated() {
			this.getAddressList();
		},
		beforeRouteEnter(to, from, next) {
			console.log(from);
			next(vm => {
				vm.url = from.path;
			})
		},
		methods: {
			//地址列表
			getAddressList: function() {
				this.$http({
					method: 'GET',
					url: '/los/api/member/receiver_list.json',
					data: ''
				}).then((result) => {
					this.addressList = result.data.list;
					this.count = result.data.count;
				}).catch((err) => {
					console.log(err);
				})
			},
			//付款页返回参数
			addSiteInfo: function(receiver_id) {
				this.order_from = this.$route.params.order_from;
				this.order_url = '';
				if(this.order_from == 'auction_order') {
					this.order_url = '/los/api/auction/order_receiver.json';
					var params = {
						order_sn: this.$route.params.order_sn,
						receiver_id: receiver_id
					}
				} else if(this.order_from == 'seckill_order') {
					this.order_url = '/los/api/seckill/order_receiver.json';
					var params = {
						order_sn: this.$route.params.order_sn,
						receiver_id: receiver_id
					}
				} else if(this.order_from == 'auction_signup') {
					this.order_url = '/los/api/auction/signup_receiver.json';
					var params = {
						signup_id: this.$route.params.order_sn,
						receiver_id: receiver_id
					}
				}
				console.log(params);
				if(this.order_url != '') {
					this.$http({
						method: 'POST',
						url: this.order_url,
						data: params
					}).then((result) => {
						console.log(result);
						let urls = this.url;
						this.$router.push({
							path: urls
						})
					}).catch((err) => {
						console.log(err);
					})
				}
			},
			defaultAdd: function(receiver_id) {
				var params = {
					receiver_id: receiver_id
				}
				this.$http({
					method: 'POST',
					url: '/los/api/member/receiver_default.json',
					data: params
				}).then((result) => {
					if(result.data.code == 1) {
						this.success = !this.success;
						this.msg = result.data.msg;
						this.$nextTick(() => {
							this.getAddressList();
						})
					}
				}).catch((err) => {
					console.log(err);
				})
			},
			addSite: function() {
				this.$router.push({
					name: 'AddSite',
					params: {
						order_sn: this.$route.params.order_sn,
						order_from: this.$route.params.order_from,
						urls: this.url
					}
				})
			},
			back: function() {
				window.history.go(-1);
			}
		}
	}
</script>

<style scoped>
	/*地址信息*/
	
	.addList {
		width: 100%;
		position: relative;
		background: #fff;
		/*height: 13.33rem;*/
		overflow: hidden;
	}
	
	.header {
		background: #fff;
	}
	
	.addList .border_img {
		width: 100%;
		position: absolute;
		margin-top: 0.02rem;
	}
	
	.addList ul li {
		height: 2.53rem;
		padding: 0.26rem;
		overflow: hidden;
		font-size: 0.37rem;
		color: #333;
		position: relative;
	}
	
	.addList ul li:after {
		content: " ";
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		height: 1px;
		border-bottom: 1px solid #e6e6e6;
		color: #e6e6e6;
		transform-origin: 0 0;
		transform: scaleY(0.5);
	}
	
	.addList ul li .left_bar {
		float: left;
		padding: 0.26rem 0;
		text-align: left;
		width: 25%;
		overflow: hidden;
	}
	
	.addList ul li .left_bar span {
		border: solid 1px #da4240;
		width: 0.82rem;
		height: 0.45rem;
		line-height: 0.45rem;
		border-radius: 0.05rem;
		font-style: normal;
		font-size: 0.29rem;
		color: #da4240;
		text-align: center;
		display: block;
		margin-top: 0.32rem;
	}
	
	.addList ul li .left_bar .default {
		border: solid 1px #777;
		width: 0.82rem;
		height: 0.45rem;
		line-height: 0.45rem;
		border-radius: 0.05rem;
		font-style: normal;
		font-size: 0.29rem;
		color: #777;
		text-align: center;
		display: block;
		margin-top: 0.32rem;
	}
	
	.addList ul li .info {
		margin-left: 1rem;
		float: left;
		width: 5.7rem;
		padding: 0.26rem 0;
	}
	
	.addList ul li .info p {
		margin-top: 0.26rem;
		color: #777;
		font-size: 0.32rem;
		line-height: 0.53rem;
		height: 1.06rem;
		text-overflow: ellipsis;
		overflow: hidden;
	}
	
	.addList ul li .right_bar {
		position: absolute;
		display: block;
		right: 0.26rem;
		top: 0.52rem;
	}
	
	.addList ul li .right_bar img {
		width: 0.42rem;
		height: 0.42rem;
	}
	
	.addList ul li .del_bar {
		width: 0.5rem;
		height: 0.5rem;
		display: block;
		position: absolute;
		right: 0.22rem;
		bottom: 0.52rem;
	}
	
	.addList ul li .del_bar img {
		width: 100%;
		height: 100%;
	}
	
	.addBtn {
		width: 90%;
		left: 5%;
		bottom: 0.52rem;
		position: absolute;
		line-height: 1.3rem;
		background: #a30000;
		border-radius: 0.05rem;
		text-align: center;
	}
	
	.addBtn span {
		width: 100%;
		height: 100%;
		color: #fff;
		display: block;
		font-size: 0.4rem;
		text-align: center;
	}
</style>